
<script setup lang='ts'>
import {} from 'vue'
import {useRouter} from "vue-router"
const router = useRouter()
const backHome = ()=>{
    router.push("/")
}
const renovate = ()=>{
    window.location.reload();
}
</script>
<template>
    <div class="app-container">
        <div class="contain">
            <svg-icon name="403" class="pageIcon"></svg-icon>
            <div class="desc">
                <h2>403</h2>
                <p>抱歉,你没有权限访问此页面,可联系管理员</p>
                <div class="btns">
                    <el-button size="small"  @click="backHome">返回首页</el-button>
                </div>
            </div>
        </div>
    </div>
</template>
<style lang='scss' scoped>
.contain{
    width:100%;
    height: 100%;
    display: flex;
    justify-content:center;
    align-items: center;
}
 .pageIcon{
     font-size: 500px;
 }
 .desc{
     h2{
        text-align: center;
         font-size: 150px;
         margin:0;
         margin-bottom: 20px;
     }
     p{
         text-align: left;
         font-size: 20px;
         margin:0;
     }
     .btns{
        margin: 10px auto 0;
        text-align: center ;
    }
     
 }
 
</style>